Data Template Selector এবং Item Template Customization

DataTemplate এবং ItemTemplate WPF (Windows Presentation Foundation) এ ডেটা বাইন্ডিংয়ের মাধ্যমে UI উপাদান কাস্টমাইজ করার জন্য ব্যবহৃত হয়। DataTemplate ডেটা অবজেক্টের জন্য UI উপাদান কাস্টমাইজ করে, এবং ItemTemplate ব্যবহার করা হয় ListBox, ComboBox, বা অন্যান্য ICollectionView-বিন্যস্ত কন্ট্রোলগুলিতে আইটেমগুলি কাস্টমাইজ করতে। যখন ডেটা অবজেক্টের ভিত্তিতে বিভিন্ন UI উপাদান বা বিন্যাস নির্বাচন করার প্রয়োজন হয়, তখন DataTemplateSelector ব্যবহার করা হয়।

DataTemplate এবং ItemTemplate এর মধ্যে পার্থক্য

• DataTemplate:
  • এটি একটি বিশেষ UI উপাদান বা কন্ট্রোল তৈরি করার জন্য ব্যবহৃত হয় যেটি একটি ডেটা অবজেক্টের সাথে বাইন্ড হয়।
  • এটি সাধারণত একক ডেটা উপাদানের জন্য ব্যবহৃত হয় এবং UI এর লেআউট এবং ফরম্যাট কাস্টমাইজ করে।
• ItemTemplate:
  • এটি সাধারণত ListBox, ComboBox, DataGrid ইত্যাদি কন্ট্রোলের আইটেমগুলির জন্য ব্যবহৃত হয়। যখন একটি কন্ট্রোল একটি ডেটা সংগ্রহ (যেমন List, Collection) প্রদর্শন করে, তখন ItemTemplate ব্যবহার করে আইটেমের UI কাস্টমাইজ করা হয়।

DataTemplateSelector

DataTemplateSelector WPF-তে একটি কাস্টম ক্লাস যা আপনাকে ডেটার ধরনের উপর ভিত্তি করে ডেটা টেমপ্লেট নির্বাচন করতে সহায়তা করে। যখন একাধিক DataTemplate থাকে এবং আপনি ডেটার ধরণের উপর ভিত্তি করে আলাদা UI টেমপ্লেট নির্বাচন করতে চান, তখন DataTemplateSelector ব্যবহার করা হয়।

DataTemplateSelector এর ব্যবহার

1. DataTemplateSelector একটি কাস্টম ক্লাস হিসেবে তৈরি করতে হয় যা SelectTemplate মেথড Override করে।
2. SelectTemplate মেথডটি তখন ডেটার উপাদান অনুসারে সঠিক DataTemplate নির্বাচন করে।

উদাহরণ: DataTemplateSelector ব্যবহার

ধরা যাক আমাদের কাছে দুইটি ধরনের ডেটা অবজেক্ট রয়েছে, একটি Product এবং একটি Customer, এবং আমরা এই ডেটার জন্য আলাদা DataTemplate ব্যবহার করতে চাই।

Step 1: DataTemplateSelector ক্লাস তৈরি করা

public class CustomTemplateSelector : DataTemplateSelector
{
    public DataTemplate ProductTemplate { get; set; }
    public DataTemplate CustomerTemplate { get; set; }

    public override DataTemplate SelectTemplate(object item, DependencyObject container)
    {
        if (item is Product)
        {
            return ProductTemplate;
        }
        else if (item is Customer)
        {
            return CustomerTemplate;
        }
        return base.SelectTemplate(item, container);
    }
}

এখানে, CustomTemplateSelector ক্লাসটি DataTemplateSelector কে ইনহেরিট করে। SelectTemplate মেথডটি কাস্টমাইজ করা হয়েছে যাতে এটি ডেটার ধরন অনুযায়ী টেমপ্লেট সিলেক্ট করে।

Step 2: XAML এ DataTemplate এবং TemplateSelector ব্যবহার করা

<Window x:Class="WPFApplication.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WPFApplication"
        Title="DataTemplateSelector Example" Height="350" Width="525">
    
    <Window.Resources>
        <!-- Data Templates for Product and Customer -->
        <DataTemplate x:Key="ProductTemplate">
            <StackPanel>
                <TextBlock Text="Product" FontWeight="Bold"/>
                <TextBlock Text="{Binding Name}"/>
                <TextBlock Text="{Binding Price}"/>
            </StackPanel>
        </DataTemplate>

        <DataTemplate x:Key="CustomerTemplate">
            <StackPanel>
                <TextBlock Text="Customer" FontWeight="Bold"/>
                <TextBlock Text="{Binding Name}"/>
                <TextBlock Text="{Binding Address}"/>
            </StackPanel>
        </DataTemplate>

        <!-- DataTemplateSelector -->
        <local:CustomTemplateSelector x:Key="CustomTemplateSelector"
                                      ProductTemplate="{StaticResource ProductTemplate}"
                                      CustomerTemplate="{StaticResource CustomerTemplate}" />
    </Window.Resources>

    <Grid>
        <ListBox ItemsSource="{Binding Data}"
                 ItemTemplateSelector="{StaticResource CustomTemplateSelector}">
        </ListBox>
    </Grid>
</Window>

Step 3: Data Binding and DataContext

public partial class MainWindow : Window
{
    public ObservableCollection<object> Data { get; set; }

    public MainWindow()
    {
        InitializeComponent();

        // Sample data
        Data = new ObservableCollection<object>
        {
            new Product { Name = "Laptop", Price = "$1200" },
            new Customer { Name = "John Doe", Address = "123 Main St" }
        };

        DataContext = this;
    }
}

public class Product
{
    public string Name { get; set; }
    public string Price { get; set; }
}

public class Customer
{
    public string Name { get; set; }
    public string Address { get; set; }
}

এখানে:

• Product এবং Customer ক্লাসের জন্য আলাদা DataTemplate তৈরি করা হয়েছে।
• CustomTemplateSelector কাস্টম ক্লাসে SelectTemplate মেথড ব্যবহার করে সঠিক টেমপ্লেট নির্বাচন করা হয়েছে।
• ListBox এ ItemTemplateSelector ব্যবহার করা হয়েছে, যেখানে CustomTemplateSelector এর মাধ্যমে সঠিক টেমপ্লেট নির্বাচিত হবে।

ItemTemplate Customization

ItemTemplate ListBox বা ComboBox ইত্যাদি কন্ট্রোলের আইটেম কাস্টমাইজ করার জন্য ব্যবহৃত হয়। এটি ব্যবহার করে আপনি কন্ট্রোলের আইটেমগুলোর উপস্থাপন পদ্ধতি পরিবর্তন করতে পারেন। ItemTemplate ব্যবহার করে, আপনি UI কন্ট্রোলের আউটপুটকে সম্পূর্ণভাবে কাস্টমাইজ করতে পারবেন।

উদাহরণ: ListBox এর ItemTemplate কাস্টমাইজ করা

<ListBox>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <TextBlock Text="{Binding Name}" FontWeight="Bold"/>
                <TextBlock Text="{Binding Description}"/>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

এখানে, ItemTemplate ব্যবহার করে ListBox এর প্রতিটি আইটেমের জন্য একটি কাস্টম UI তৈরি করা হয়েছে। প্রতিটি আইটেমের মধ্যে Name এবং Description ডেটার মান প্রদর্শন করা হচ্ছে।

সারাংশ (Summary)

• DataTemplate UI কাস্টমাইজেশনের জন্য ব্যবহৃত হয়, যা ডেটার ধরন অনুযায়ী কন্ট্রোলের উপস্থাপন পরিবর্তন করে।
• ItemTemplate ব্যবহার করে, ListBox, ComboBox, বা অন্যান্য ICollectionView কন্ট্রোলের আইটেম কাস্টমাইজ করা যায়।
• DataTemplateSelector ব্যবহার করে আপনি ডেটার ধরন অনুযায়ী আলাদা টেমপ্লেট নির্বাচন করতে পারেন।
• ItemTemplate এবং DataTemplateSelector এর মাধ্যমে আপনি WPF অ্যাপ্লিকেশনে কাস্টম UI উপাদান তৈরি এবং ডেটা প্রদর্শন করতে সক্ষম।